<template>
	<navbar title="收货地址" :isBack="true"></navbar>
	<view class="page">
		<view class="item" v-for="(item,index) in addressList" @click="clickItem(item)"
			style="padding: 30rpx;background-color: white;border-radius: 10rpx;font-size: 32rpx;margin-bottom: 20rpx;">
			<view class="" style="">
				{{item.province}}{{item.city}}{{item.area}}
			</view>
			<view class=""
				style="margin-top: 20rpx;font-weight: bold;display: flex;justify-content: space-between;align-items: center;">
				<view class="">
					{{item.address}}
				</view>
				<image @click.stop="edit(item.id)" src="/static/address/edit.png" style="width: 40rpx;height: 40rpx;"
					mode=""></image>
			</view>
			<view class="" style="margin-top: 20rpx;font-size: 28rpx;">
				{{item.name}} {{item.mobile}}
			</view>
			<view class="line" style="margin-top: 30rpx;height: 1rpx;border-bottom: 1rpx solid #F5F6F8;">

			</view>
			<view class="" style="margin-top: 30rpx;display: flex;justify-content: flex-end;align-items: center;">
				<view class="" style="display: flex;justify-content: center;align-items: center;"
					@click.stop="del(item.id)">
					<image src="/static/address/delete.png" style="width: 40rpx;height: 40rpx;" mode=""></image>
					<view class="" style="font-size: 24rpx;color: #696969;margin-left: 5rpx;">
						删除
					</view>
				</view>
				<view class="" style="display: flex;justify-content: center;align-items: center;margin-left: 30rpx;"
					@click="defaultAddress(index)">
					<image v-if="!item.is_default" src="/static/address/default.png" style="width: 40rpx;height: 40rpx;"
						mode=""></image>
					<image v-else src="/static/address/active.png" style="width: 40rpx;height: 40rpx;" mode=""></image>
					<view class="" style="font-size: 24rpx;color: #696969;margin-left: 5rpx;">
						设为默认地址
					</view>
				</view>
			</view>
		</view>
		<view class="" @click="add"
			style="margin-top: 20rpx;border-radius: 10rpx;height: 100rpx;display: flex;justify-content: center;align-items: center;font-size: 28rpx;background-color: white;">
			+新增收货地址
		</view>
		<u-modal v-model="modalShow" :content="content" @confirm="modalConfirm" @cancel="modalShow=false"
			show-cancel-button></u-modal>

	</view>
</template>

<script setup lang="ts">
	import { ref, reactive } from 'vue'
	import tools from '@/utils/tools';
	import { userAddress, addressDel, setDefault } from '@/service/api/index'
	import { onShow, onLoad } from '@dcloudio/uni-app'
	const addressState = ref(false);//0是未选中 1是选择默认地址
	const modalShow = ref(false);
	const addressList = ref([
		{
			id: "",
			user_id: "",
			province: "",
			city: "",
			area: '',
			address: "",
			name: "",
			mobile: "",
			is_default: 0,
			state: ""
		}
	])
	const param = reactive({
		id: "", 
		specs: "",
		address_id: ""
	})
	const id = ref('')
	const content = ref('是否确认删除?');
	onLoad((options) => {
		console.log(options);
		if (options) {
			for (let i in param) {
				param[i] = options[i]
			}
		}
	})
	onShow(() => {
		getData()
	})
	const clickItem = (item : any) => {
		if(!param.id) return
		uni.setStorageSync('id', param.id)
		uni.setStorageSync('specs', param.specs)
		uni.setStorageSync('item', JSON.stringify(item));
		 
		uni.navigateBack();
		// if (param.id) {
		// 	console.log(item);

		// 	tools.navTo('/pagesB/order/index?id=' + param.id + '&specs=' + param.specs + '&item=' + JSON.stringify(item), 4)
		// }
	}
	//获取列表
	const getData = async () => {
		const res = await userAddress("");
		addressList.value = res.msg;
		console.log(addressList.value);
	}

	//设置默认地址
	const defaultAddress = (index : number) => {
		addressList.value.forEach(async (item : any, i : number) => {
			if (index == i) {
				item.is_default = item.is_default == 0 ? 1 : 0;
				const res = await setDefault({ id: item.id })
				if (res.code == 1) {

					getData()
				}
				tools.showToast(res.msg);

			}
		})
		//addressState.value = !addressState.value
	}
	//删除提示
	const del = (val : string) => {
		id.value = val;
		modalShow.value = true;
	}
	//确认删除
	const modalConfirm = async () => {

		const res = await addressDel({ id: id.value });
		if (res.code == 1) {
			modalShow.value = false;
			getData()
		}
		tools.showToast(res.msg);
	}
	//添加收货地址
	const add = () => {
		tools.navTo('/pagesB/order/add');

	}
	const edit = (id : string) => {

		tools.navTo('/pagesB/order/add?id=' + id );
	}
</script>

<style scoped lang="scss">
	.page {
		min-height: calc(100vh - 68px);
		background-color: #F8F8F9;
		padding: 20rpx 30rpx;
		overflow: hidden;
	}
</style>